<template>
	<yd-layout id='moneyWithdraw' class=''>
		<div class="header">
			<div class="header_label">*请确保银行卡与姓名正确匹配，避免提现失败*</div>
		</div>
		<div class="content">
			<div class="list">
				<div class="list_label c_size_34_48">持卡姓名</div>
				<input placeholder="如:张三" v-model="form.real_name" class="list_input" type="text" />
			</div>
			<div class="list">
				<div class="list_label c_size_34_48">开户银行</div>
				<select class="list_input" name="" id="" v-model="form.bank_id" :style="{color:form.bank_id?'#333333':'#333333'}">
					<option value="" selected="selected" disabled="disabled" >请选择</option>
					<option  v-for="item in bankList" :value="item.id">{{item.bank_name}}</option>
				</select>
				<img class="list_img" src="../../assets/bd_img/right.png" alt="" />
			</div>
			<div class="list">
				<div class="list_label c_size_34_48">银行卡号</div>
				<input type="number" 
					v-model.trim="form.card_id"
					oninput="if(value.length>19)value=value.slice(0,19)"
					pattern="\d*"  
					placeholder="如:6288 8888 8888 8888"
					class="list_input"  
					/>
			</div>
			<div class="list_money">
				<div class="list_top">
					<div class="list_label c_size_34_48">提现金额</div>
					<!--pattern="\d*"-->  
					<input
						@input="changeInput(form.money)"
						v-model.trim="form.money"
						placeholder="请输入整数金额"
						class="list_input" 
						type="number" 
						pattern="\d*"  
						/>
				</div>
				<div class="list_bottm">
					<div class="span"></div>
					<span class="list_bottm_c">可提现{{dataObj.tradeable_money}}</span>
				</div>
			</div>
		</div>
		<div @click="withDrawBtn" class="btn">确定提现</div>
		<div class="bottom_label">
			<div>注：</div>
			<div>
				<!--<div>1、每笔提现需收取2%手续费</div>-->
				<div>单笔提现最低100起，最高10000</div>
			</div>
		</div>
	</yd-layout>
</template>

<script>
	export default{
		components:{
			
		},
		data(){
			return {
				bankList:[],
				dataObj:{},
				"form": {
				    "real_name": "",
				    "card_id": "",
				    "bank_id": "",
				    "money": "",
				},
			}
		},
		created() {
		},
		watch: {
			
		},
		computed: {
			
		},
		mounted(){
			document.title='提现到银行卡'
			this.getBanks()
			this.getMy();
			this.getOldMsg()
		},
		methods:{
			getOldMsg(){
				this.$root.ajax({
					name:'my/withdraw/last',
					type:'get',
					params: {
						
					}
				}).then((d) => {
					if(d.data){
						d.data.money = ''
						this.form = Object.assign({},this.form,d.data)
					}
				})
			},
			changeInput(value){
				value = value+''
				console.log(value)
				if(value>10000){
					this.form.money=10000
					return
				}
				if(!value){
					this.form.money=100
				}
				if(value.indexOf('.')==0){
					this.form.money=''
				}else if(value.indexOf('.')>0){
					this.form.money=parseInt(this.form.money)
				}
				if(value.length>5){
					this.form.money = value.slice(0,5)
				}
			},
			getMy(){
				this.$root.ajax({
					name: 'my',
					type:'get',
					params: {
						
					}
				}).then((d) => {
					this.$root.setMoneyZero(d.data,'tradeable_money')
					this.dataObj =Object.assign({},this.dataObj ,d.data)
				})
			},
			getBanks(){
				this.$root.ajax({
					name: 'my/banks',
					type:'get',
					params: {
						
					}
				}).then((d) => {
					this.bankList = d.data
				})
			},
			withDrawBtn(){
				
				if(!this.form.real_name){
					this.$dialog.toast({
	                    mes: '请输入持卡人姓名',
	                    timeout: 1500,
	                });
	                return
				}
				if(!this.form.bank_id){
					this.$dialog.toast({
	                    mes: '请选择开户银行名称',
	                    timeout: 1500,
	                });
	                return
				}
				if(!this.form.card_id){
					this.$dialog.toast({
	                    mes: '请输入银行卡号',
	                    timeout: 1500,
	                });
	                return
				}else{
					if(this.form.card_id.length<18){
						this.$dialog.toast({
		                    mes: '请输入正确的银行卡号',
		                    timeout: 1500,
		                });
		                return
					}
				}
				if(!this.form.money){
					this.$dialog.toast({
	                    mes: '请输提现金额',
	                    timeout: 1500,
	                });
	                return
				}else{
					if(this.form.money<100){
						this.$dialog.toast({
		                    mes: '单笔提现必须大于100',
		                    timeout: 1500,
		                });
		                return
					}
				}
				this.$dialog.confirm({
                    title: '温馨提示',
                    mes: '请确认你的提现信息，提交后无法修改',
                    opts: [
                        {
                            txt: '取消',
                            color: '#999999',
                            callback: () => {

                            }
                        },
                        {
                            txt: '确定提现',
                            color: '#DCBBC9',
                            callback: () => {
                            	this.submit();
                      		},
                    	},
                    ]
                });
			},
			submit(){
				var o = {
				    "real_name": this.form.real_name,
				    "card_id": this.form.card_id,
				    "bank_id": this.form.bank_id,
				    "money": this.form.money,
				}
				this.$root.ajax({
					name: 'my/reqWithdraw',
					params: o
				}).then((d) => {
					this.$router.push({
						name:'moneySuccess'
					})
				})
			}
		}
	}
</script>

<style lang="scss">
	@import './moneyWithdraw.scss';
</style>